<template>
    <div class ="set1">迈迪科医疗器械，您值得信赖。</div>
    <div class="demo-image__lazy">
        <el-image v-for="url in urls" :key="url" :src="url" lazy />
    </div>
    <div class ="set1">产品介绍：</div>
    <hr>
    <div>{{cat1 }}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>多普勒治疗仪</template>
            <img
                    src="../assets/images/1.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：999999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>C臂型X光机</template>
            <img
                    src='../assets/images/2.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：99999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>CT控制盒</template>
            <img
                    src='../assets/images/3.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：99888</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>CT机</template>
            <img
                    src='../assets/images/4.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：1000000</template>
        </el-card></el-col>
    </el-row>
    <hr>
    <div>{{cat2 }}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>下肢辅助设备</template>
            <img
                    src="../assets/images/5.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：569999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>外骨骼机器人</template>
            <img
                    src='../assets/images/6.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：129999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>牵引器</template>
            <img
                    src='../assets/images/7.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：498999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>代步轮椅</template>
            <img
                    src='../assets/images/8.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：788</template>
        </el-card></el-col>
    </el-row>
    <hr>
    <div>{{cat3 }}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>纯水仪</template>
            <img
                    src="../assets/images/9.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：2899</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>稀释仪</template>
            <img
                    src='../assets/images/10.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：8999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>血浆机</template>
            <img
                    src='../assets/images/11.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：999980</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>X荧光分析仪</template>
            <img
                    src='../assets/images/12.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：888888</template>
        </el-card></el-col>
    </el-row>
    <hr>
    <div>{{cat4 }}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>脑波设备</template>
            <img
                    src="../assets/images/13.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：78999999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>老人陪护机器</template>
            <img
                    src='../assets/images/14.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：9999900</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>颈椎治疗仪</template>
            <img
                    src='../assets/images/15.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>护眼仪</template>
            <img
                    src='../assets/images/16.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：999</template>
        </el-card></el-col>
    </el-row>
    <hr>
    <div>{{cat5}}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>血糖检测仪</template>
            <img
                    src="../assets/images/17.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：9909</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>心电监测仪</template>
            <img
                    src='../assets/images/18.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：89999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>点滴警报仪</template>
            <img
                    src='../assets/images/19.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：90119</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>BMI测试仪</template>
            <img
                    src='../assets/images/20.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：9089</template>
        </el-card></el-col>
    </el-row>
    <hr>
    <div>{{cat6 }}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>痛经治疗仪</template>
            <img
                    src="../assets/images/21.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：289980</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>干眼治疗仪</template>
            <img
                    src='../assets/images/22.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：999</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>高电位治疗仪</template>
            <img
                    src='../assets/images/23.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：989</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>皮肤护理仪</template>
            <img
                    src='../assets/images/24.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：999</template>
        </el-card></el-col>
    </el-row>
    <hr>
    <div>{{cat6 }}</div>
    <el-row>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>制氧机</template>
            <img
                    src="../assets/images/25.jpg"
                    style="width: 100%"
            />
            <template #footer>售价：99918</template>
        </el-card></el-col>
        <el-col :span="6"><div class="grid-content ep-bg-purple-dark" />    <el-card style="max-width: 200px"shadow="hover">
            <template #header>雾化器</template>
            <img
                    src='../assets/images/26.jpg'
                    style="width: 100%"
            />
            <template #footer>售价：999</template>
        </el-card></el-col>
    </el-row>
</template>
<style scoped>
.demo-image__lazy {
    height: 400px;
    overflow-y: auto;
}
.demo-image__lazy .el-image {
    display: block;
    min-height: 200px;
    margin-bottom: 10px;
}
.demo-image__lazy .el-image:last-child {
    margin-bottom: 0;
}
</style>
<style lang="scss">
.el-row {
  margin-bottom: 20px;
}
.el-row:last-child {
  margin-bottom: 0;
}
.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
</style>
<script lang="ts">
export default {
    data() {
        return{
            cat1:"影像类",
            cat2:"康复类",
            cat3:"实验室类",
            cat4:"家庭用",
            cat5:"检测类",
            cat6:"治疗类",
            cat7:"呼吸类"
        }

    },
}
</script>
<script lang="ts" setup>
const urls = [
    'https://www.yl-designs.com/admin/edit2/attached/image/20181025/20181025150453_48526.jpg',
    'https://ts1.cn.mm.bing.net/th/id/R-C.a1221d71ac3737d5886b763c96b4db72?rik=mZJXeYHpY3V0pw&riu=http%3a%2f%2fn.sinaimg.cn%2ftranslate%2fw1560h869%2f20180312%2fv1yh-fyscsmu8058515.jpg&ehk=5mpXT5uioYRbhg0ytWEpsmQKy3QztVrrBU0Bg6OJgbc%3d&risl=&pid=ImgRaw&r=0',
    'https://ts1.cn.mm.bing.net/th/id/R-C.3f477865ce0af9a7f059292b13c0fa35?rik=zn5M7BuqINVAaA&riu=http%3a%2f%2fimg602.yun300.cn%2frepository%2fimage%2f63c7fbjnRTuXWbRf433r3w.jpg_%7bi%7dxaf.jpg%3ftenantId%3d218267%26viewType%3d1&ehk=sO05cXgXipS9TN6uJixhGDd9CkklID4FdlJfBPDmINo%3d&risl=&pid=ImgRaw&r=0',
    'https://ts1.cn.mm.bing.net/th/id/R-C.8a1c98b862cf8300c1d7b8bba67b8e94?rik=Yb8Scbp%2bHqPi9g&riu=http%3a%2f%2fwww.3dshowind.cn%2fuploadfile%2fimage%2f20220330%2f1648625467381687.jpg&ehk=1gE6H9V1aAGul6Rc%2fi0vt1BCsUop9Y%2fStVwCvszX%2fhg%3d&risl=&pid=ImgRaw&r=0',

]
</script>

